<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>中南财经政法大学发票管理系统</title>
    <style>
        body {
            background-size: cover;
            background-image: url("photo/640.jpg");
            font-family: 'Arial', sans-serif;
            color: #333;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
            flex-direction: column;
        }
        select {
            width: 300px; /* 增加宽度 */
            height: 40px; /* 增加高度 */
            font-size: 16px; /* 增加字体大小 */
            margin-top: 20px; /* 根据需要调整 */
        }
        .login-container {
            width: 350px;
            padding: 20px;
            background: rgba(255, 255, 255, 0.8);
            border-radius: 10px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }
        h2 {
            text-align: center;
            color: #333;
        }
        form {
            margin-top: 20px;
        }
        input[type="text"], input[type="password"], input[type="submit"], button {
            width: 100%;
            padding: 10px;
            border: 1px solid #ddd;
            border-radius: 5px;
            box-sizing: border-box;
            margin-top: 5px;
        }
        input[type="submit"], button {
            background-color: #007bff;
            color: white;
            font-size: 16px;
            cursor: pointer;
        }
        input[type="submit"]:hover, button:hover {
            background-color: #0056b3;
        }
        button {
            background-color: #5cb85c;
        }
        button.btn-transparent {
            background: transparent;
            color: #333;
        }
    </style>
</head>
<body>

<!-- 病人登录表单 -->
<div id="UserForms" class="login-container" style="display: block;">
    <h2>用户登录</h2>
    <button onclick="change(true)">已注册</button>
    <button onclick="change(false)">未注册</button>

    <!-- 已挂号的登录表单 -->
    <form id="registered-form" action="/demo1/UserLoginServlet" method="post" style="display: none;">
        您的ID:<br>
        <input type="text" name="id" required><br>
        您的密码Password:<br>
        <input type="password" name="password" required><br>
        <input type="submit" value="Login">
    </form>

    <!-- 未挂号的登录表单 -->
    <form id="unregistered-form" method="post" style="display: none;">
        <!-- 按钮用于触发获取新挂号 ID 的操作 -->
        <button type="button" id="getNewIdBtn">获取您新的用户id</button>
    </form>
</div>

<script>
    document.addEventListener('DOMContentLoaded', function() {
        // 获取表单和按钮元素
        document.getElementById('unregistered-form');
        const getNewIdBtn = document.getElementById('getNewIdBtn');//在此定义
        // 为按钮点击事件添加处理函数
        getNewIdBtn.addEventListener('click', function() {
            // 发送请求到 Servlet 以获取新的挂号 ID
            fetch('/demo1/UserRegisterServlet')
                .then(response => {
                    if (!response.ok) {
                        throw new Error('Network response was not ok');
                    }
                    return response.json();
                })
                .then(data => {
                    // 从 JSON 响应中获取 ID
                    const id = data.id;
                    // 显示提示框
                    alert("您的新id为 " + id + " 初始密码为123456，请尽快登录并修改密码");
                    // 如果需要，可以将新 ID 显示在表单中或进行其他操作
                    // ...
                })
                .catch(error => {
                    console.error('Error fetching new patient ID:', error);
                    alert('请求失败：' + error.message);
                });
        });
    });
</script>
<script>

    function change(showRegistered) {
        var regForm = document.getElementById('registered-form');
        var unregForm = document.getElementById('unregistered-form');

        if (showRegistered) {
            regForm.style.display = 'block';
            unregForm.style.display = 'none';
        } else {
            regForm.style.display = 'none';
            unregForm.style.display = 'block';
        }
    }

    document.addEventListener('DOMContentLoaded', function() {
        const registeredForm = document.getElementById('registered-form');
        const unregisteredForm = document.getElementById('unregistered-form');

        registeredForm.onsubmit = function(event) {
            event.preventDefault();
            const formData = new FormData(registeredForm);
            fetch(registeredForm.action, {
                method: 'POST',
                body: JSON.stringify(Object.fromEntries(formData)),
                headers: {
                    'Content-Type': 'application/json'
                }
            })
                .then(response => response.json())
                .then(data => {
                    if (data.status === 'success') {
                        alert(data.message); // 显示成功消息
                        window.location.href = 'UserHome.html';
                    } else if(data.status === 'more success'){
                        alert(data.message); // 显示失败消息
                        window.location.href = 'AdminHome.html';
                    }else {
                        alert(data.message); // 显示失败消息
                    }
                })
                .catch(error => {
                    console.error('Error submitting form:', error);
                    alert('请求失败：' + error.message);
                });
        };
    });
</script>
</body>
</html>